<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>{$Think.lang.post_1}</title>
<link rel='stylesheet' type='text/css' href='__HOME__/Css/index.css' />
<script type="text/javascript" src="__HOME__/Js/jquery-1.7.min.js"></script>
<script  type="text/javascript" src="__HOME__/Js/common.js"></script>
<link rel="stylesheet" href="__ROOT__/Editor/themes/default/default.css" />
<script type="text/javascript" src="__ROOT__/Editor/kindeditor-min.js"></script>
<script type="text/javascript" src="__ROOT__/Editor/lang/zh_CN.js"></script>
<script type="text/javascript" src="__HOME__/Js/editor.js"></script>
<script type="text/javascript" src="__HOME__/Js/UIDialog.js"></script>
<script type='text/javascript'>
$(document).ready(function(){
	//填充
	fillBlank();

	//创建新分类的弹出框
	$('.c_cate').click(function(){
		$.UIDialog({
			width	:	200,
			title	:	'创建新分类',
			content	:	"<div class='c_content'>"+
							"<div>"+
								"<input type='text' value='' name='category' placeholder='最多可输入14个字符' class='form_input c_input'/>"+
								"<input type='button' value='创建分类' name='sub'  class='form_sub c_sub'  />"+
							"</div>"+
						"</div>",
			//弹出层打开后执行的函数
			callOnOpen:function(){
				//获得所有分类数据
				$.post("__APP__/Index/getAllCate",'',function(allCate){
					var allCateObj = eval('('+allCate+')');
					var ul_content = "<ul class='c_c'>";
					for(i in allCateObj)
					{
						ul_content += "<li class='c_l'>"+
										 "<span class='c_c_1'>"+allCateObj[i].category+"</span>"+
										 "<a href='javascript:void(0);' rel='"+allCateObj[i].id+"' class='del_cate'>[删除]</a>"+
										 "<a href='javascript:void(0);' rel='"+allCateObj[i].id+"' class='edit_cate'>[编辑]</a>"+
										 "</li>";
					}
					ul_content += "</ul>";
					//将分类数据append到弹出框中
					$(ul_content).appendTo(".ui-dialog-body");						
				});
				
				//创建新分类，ajax传输分类名称并插入数据库
				$(".c_sub").on('click',function(){
					var category = $(".c_input").val();				
					$.post("__APP__/Index/insert_cate",{'category':category},function(data){
						var dataObj = eval('('+data+')');
						if(dataObj.success == 1)
						{
							//append新分类名到弹出框
							var newLi = "<li class='c_l'>"+
											"<span class='c_c_1'>"+dataObj.category+"</span>"+
											"<a href='javascript:void(0);' class='del_cate'   rel="+dataObj.c_id+">[删除]</a>"+
											"<a href='javascript:void(0);' class='edit_cate'  rel="+dataObj.c_id+">[编辑]</a>"+
										"</li>";
							$(newLi).appendTo(".c_c");
							
							//append新分类名到页面select并设置选中
							$("#post_form_select option").removeAttr("selected");
							//新创建的分类名进行选中
							var option_content = "<option selected='selected' value="+dataObj.c_id+">"+dataObj.category+"</option>";
							$(option_content).appendTo("#post_form_select");	
						}
					})
				});		

				//绑定删除事件
				$(".del_cate").live('click',function(){
					var t = $(this);
					var c_id = t.attr('rel');
					if(confirm('确定删除该分类？'))
					{
						$.post("__APP__/Index/del_cate",{"c_id":c_id},function(data){
							var dataObj = eval('('+data+')');
							if(dataObj.success == true)
							{
								//删除弹出框的数据
								t.parent().remove();
								//删除页面的option数据
								$("option[value='"+dataObj.c_id+"']").remove();
							}
						});
					}
				});
				
				//绑定编辑事件
				var category,c_id;
				$('.edit_cate').live('click',function(){
					var t = $(this);
					c_id = t.attr('rel');
					category = t.siblings('.c_c_1').text();
					var replace_con =  "<span>"+
											"<input type='text' value='"+category+"' name='c_id' class='form_input edit_ca'/>"+
											"<input type='button' value='保存' class='form_sub edit_save'>"+
											"<input type='button' value='取消' class='form_sub edit_not_save'>"+
										"</span>";
					//将文字替换为输入框
					var c_con = t.siblings('.c_c_1').html(replace_con);	

					//隐藏 编辑和删除
					$('.edit_cate').hide();
					$('.del_cate').hide();

				});		
				
				//点击取消返回为文本框
				$('.edit_not_save').live('click',function(){
					$(this).closest('.c_c_1').html(category);

					//显示 编辑和删除
					$('.edit_cate').show();
					$('.del_cate').show();
				});
				//点击保存，更新分类名
				$('.edit_save').live('click',function(){
					var t = $(this);
					var newCate = t.siblings('.edit_ca').val();
					$.post('__APP__/Index/up_cate',{'c_id':c_id,'category':newCate},function(data){
						//如果更新成功，则将option和弹出层都进行更新
						if(data)
						{
							//更新弹出层
							t.closest('.c_c_1').html(newCate);

							//更新页面的option数据
							$("#post_form_select option").removeAttr("selected");
							$("#post_form_select option[value='"+c_id+"']").replaceWith("<option selected='selected' value='"+c_id+"'>"+newCate+"</option>");
							
						}
					})

					//显示 编辑和删除
					$('.edit_cate').show();
					$('.del_cate').show();
				});				
			},
		})
	});
	
	
	//标签相关js
	$("#input_div").keydown(function(event){
		if(event.keyCode == 32)
		{
			var val = $(this).val();
			$(this).val('');
			
			if( $(".use_tag_li").length >= 5 )
			{
				alert("最多只能输入5个标签");
			}
			else
			{
				if(val == ' ' || val == '')
				{
					alert('不能输入空标签');
				}
				else
				{
					//添加进入ul
					li_con = "<li class='use_tag_li'><span>"+val+"</span><a href='javascript:void(0);' class='del_tag'>×</a></li>";
					$(".use_tag").append(li_con);
					//把标签添加进#form
					input_con = "<input type='hidden' name='tag[]' value='"+val+"'/>" ;
					$('#form').append(input_con);
					
					//算出标签输入框的宽度为：tag_div宽度-use_tag宽度
					var div_total_width = $(".tag_div").width();
					var ul_total_width = $(".use_tag").width();
					var input_width = div_total_width - ul_total_width;
					$("#input_div").css({'width':input_width});
				}
			}
		}
	});
	//点击叉叉删除标签
	$('.del_tag').live('click',function(){
		var tagVal = $(this).siblings('span').html();
		//移除input hidden
		$(this).parent().remove();
		$("input[value='"+tagVal+"']").remove();
	});
	//点击标签使用该标签
	$('.use_tag_a').click(function(){
		var tagVal = $(this).html();
		if( $(".use_tag_li").length >= 5 )
		{
			alert("最多只能输入5个标签");
		}
		else
		{
			var str = "<input type='hidden' value="+tagVal+" name='exist_tag[]'/>";
			$("#form").append(str);
			//添加进入ul
			li_con = "<li class='use_tag_li'><span>"+tagVal+"</span><a href='javascript:void(0);' class='del_tag'>×</a></li>";
			$(".use_tag").append(li_con);
			
			//算出标签输入框的宽度为：tag_div宽度-use_tag宽度
			var div_total_width = $(".tag_div").width();
			var ul_total_width = $(".use_tag").width();
			var input_width = div_total_width - ul_total_width;
			$("#input_div").css({'width':input_width});
		}				
	});
});
</script>
</head>
<body>
	<!-- 包含头部内容 -->
	<include file='Public:top' />
	
	<div id="wrap_body">
		<!-- 包含右边的分类列表 -->
		<div id="rightSlide">
			<include file='Public:right_slide' />
		</div>

		<div id='post_content'>
			<h2>{$Think.lang.post_1_edit}</h2>
			<form action="{:U('View/update_post')}" method='post' id="form">
				<div class='post_div'> 
					<span class='post_title'>{$Think.lang.post_2}:</span>
					<input type='text' value='{$blogList.title}' name='title' class='form_input post_input'/>
				</div> 
				
				<div class='post_div'>
					<textarea class='form_textarea' id="editor_id" name="content">{$blogList.content}</textarea>
				</div> 
				
				<div class='post_div'>
					<span class='post_title'>{$Think.lang.post_3}:</span>		
					<select name='c_id' id='post_form_select'>
						<option value='-1'>{$Think.lang.post_3_1}</option>
						<volist name='cateList' id='vo'>
							<option value='{$vo.id}' <eq name="blogList.c_id" value="$vo.id">selected='selected'</eq> >{$vo.category}</option>
						</volist>
					</select>
					<a href='javascript:void(0)' class='c_cate'>{$Think.lang.post_3_2}</a>
				</div>
				
				<div class='post_div wrap_com_cof'>
					<span class='post_title'>{$Think.lang.post_5}:</span>
					<input type='radio' value='1' name='comment_conf' <eq name="blogList.comment_conf" value="1">checked='checked'</eq> <span class="radio_span">{$Think.lang.post_5_1}</span>
					<input type='radio' value='2' name='comment_conf' <eq name="blogList.comment_conf" value="2">checked='checked'</eq> /><span class="radio_span">{$Think.lang.post_5_2}</span>
					<input type='radio' value='3' name='comment_conf' <eq name="blogList.comment_conf" value="3">checked='checked'</eq> /><span class="radio_span">{$Think.lang.post_5_3}</span>
				</div> 
				
				<div class='post_sub'>
					<input type='submit' value='{$Think.lang.post_7}' name='sub' class='form_sub post'/>
					<input type="hidden" name="id" value="{$blogList.id}">
				</div>
			</form>
		</div>
	</div>
	<!-- 包含尾部内容 -->
	<include file='Public:footer' />
</body>
</html>